<template>
 <div class="BIgbg">
  <Hedar></Hedar>
  <div class="logoImg">

  </div>
  <p class="titleS"><router-link :to="{path:'/Tenderhallhome',query: {k:0}}">首页</router-link>><router-link :to="{path:'/Expertdatabase',query: {k:2}}">专家库</router-link>><span class="titleS1" >专家详情资料</span></p>
  <div class="grzl">
  		<div class="grzlLeft">
  			<p>
  				 <img  v-if="detailS.photo ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs />
  			</p>

        <p>{{detailS.spare3}}</p>
  		</div>
  		<div class="grzlRight">
  			<p class="grzlRight1">
          <span>{{detailS.educationNumber2}} </span>
          <span>{{detailS.dateWorke}}年工作经验</span>
          <span>{{detailS.title2}} </span>
          <span>{{detailS.major}} </span>
        </p>
        <div class="grzlRight2">
          <span>简介：</span>
          <div> {{detailS.abstractsa}}</div>
        </div>
  		</div>
  </div>
  <div class="zjList">
    <h3>工作经历</h3>
    <div v-html='detailS.experience'>{{detailS.experience}}</div>
  </div>
 <div class="zjList">
    <h3>主要业绩</h3>
    <div v-html='detailS.achievement'>{{detailS.achievement}}</div>
  </div>
 <div class="zjList">
    <h3>获奖情况</h3>
    <div v-html='detailS.winning'>{{detailS.winning}}</div>
  </div>
  <div class="zjList">
    <h3>专家个人著作</h3>
    <div v-html='detailS.writings'>{{detailS.writings}}</div>
  </div>
 <div class="zjList">
    <h3>个人作品展示</h3>
    <ul>
      <li> <img  v-if="detailS.show0 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
      <li> <img  v-if="detailS.show1 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
     <li> <img  v-if="detailS.show2 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
     <li> <img  v-if="detailS.show3 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
     <li> <img  v-if="detailS.show4 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
     <li> <img  v-if="detailS.show5 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
      <li> <img  v-if="detailS.show6 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
      <li> <img  v-if="detailS.show7 ? show1:!show1" v-bind:src=detailS.photo />
           <img  v-else v-bind:src=bannerImgs2 /></li>
    </ul>
  </div>

  <Footers></Footers>
</div>
</template>

<script>
 import Hedar from'@/components/Hedar'
 import Footers from'@/components/Footers'
  export default {
	data () {
	    return {
			bannerImgs:require('@/assets/txone.png'),
      bannerImgs2:require('@/assets/txtwo.png'),
      show1:true,
      name:"杨国福",
      zjid:'',
      detailS:'',
	    }
    },
	methods: {
	   getdetails(){
       window.scrollTo(0,0)
        var that=this
        $.ajax({
              type: "post",
              url: local+"/awm/experts/expertsDetails",
              data: {
                  id:that.zjid
              },
              dataType: "json",
              beforeSend:function (xhr) {
                xhr. withCredentials=true
              },
              success: function(data){
                  console.log(data)
                  that.detailS=data.resultData


              },
              error:function(aa){
                console.log(aa)
              }
            });
     }

	},
   mounted () {
      this.zjid = this.$route.query.stage
      this.getdetails()

    },
	components:{
	    Hedar,
	    Footers
	  }
  }
</script>
<style scoped>
 .BIgbg{
 background:#f1f1f1;
 }
 .logoImg{
  width:100%;
  height:120px;
  background:url(../assets/logobig1.png) no-repeat 0 0;
  overflow: hidden;
}
.logoImg .lOgin_search{
  width:490px;
  height:120px;
  margin-left:282px;
  background:url(../assets/gxtm.png) no-repeat 46px 35px;
}


.titleS{
	margin:15px 0;
	text-align:left;
	padding-left:15px;
}
.titleS a{
	color:#444;
	padding:0 5px;
}
.titleS .titleS1{
	color:#459dff;
}
.grzl{
  padding-left:15px;
  width:100%;
  margin-bottom:40px;
  overflow: auto;
  zoom: 1;
}
.grzlLeft{
  float:left;
  background:#fff;
  width:300px;
  height:385px;
  margin-right:13px;

}
.grzlLeft p:nth-child(1){
  border:2px solid #a0a0a0;
  border-radius:50%;
  width:140px;
  height:140px;
  margin-left:80px;
  margin-top:50px;
  margin-bottom:40px;
}
.grzlLeft p:nth-child(1) img{
  border-radius:50%;
  width:140px;
  height:140px;
}
.grzlLeft p:nth-child(2){
  font-size:22px;
}
.grzlRight{
  float:left;
  background:#fff;
  width:885px;
  height:385px;
}
.grzlRight{
  float:left;
  background:#fff;
  width:885px;
  height:385px;
}
.grzlRight1{
  width:885px;
  height:90px;
  padding-top:30px;
}
.grzlRight1 span{
  width:180px;
  height:45px;
  display:inline-block;
  background:#ff8328;
  color:#fff;
  line-height:45px;
  margin-right:20px;
  border-radius:20px;
  font-size:18px;
}
.grzlRight2 {
  width:780px;
  height:235px;
  padding-left:45px;
  overflow: auto;
  zoom: 1;
  text-align:left;
}
.grzlRight2 span{
  width:700px;
  height:16px;
  display:inline-block;
}
.grzlRight2 div{
  width:760px;


}
.zjList{
  margin-left:15px;
  width:1200px;
  background:#fff;
  text-align:left;
}
.zjList h3{
  line-height:50px;
  padding-left:30px;
  width:1170px;
  height:50px;
  background:#e5e5e5;
  font-size:22px;
}
.zjList div{
  line-height:32px;
  padding-left:30px;
  width:1150px;
  min-height:50px;
  font-size:16px;
}
.zjList ul{
  width:1199px;
  padding-top:5px;
  min-height:50px;
  font-size:16px;
  overflow: auto;
  zoom: 1;
  padding-left:1px;
}
.zjList ul li{

  width:275px;
  height:275px;
  zoom: 1;
  background:#e5e5e5;
  float:left;
  margin:12px;
}
.zjList ul li img{
  width:275px;
  height:275px;

}
</style>
